<template>
  <el-dialog
      title="党建工作方案审批"
      :visible.sync="visible" :center="true"
      width="70%" :close-on-click-modal="false">
    <el-descriptions :column="3" border size="mini" label-class-name="my-label">
      <el-descriptions-item label="任务名称">{{ title }}</el-descriptions-item>
      <el-descriptions-item label="任务负责人">{{ personInCharge }}
      </el-descriptions-item>
      <el-descriptions-item label="完成时间">{{ endTime }}</el-descriptions-item>
    </el-descriptions>
    <el-table :data="indicatorDetailSchemeApprovalVOS" :border="true" size="mini">
      <el-table-column label="序号" min-width="10%" type="index"></el-table-column>
      <el-table-column label="方案内容" min-width="50%" prop="schemeContent"></el-table-column>
      <el-table-column label="附件" min-width="40%">
        <template slot-scope="scope">
          <el-tag v-for="(att, idx) in scope.row.kpiSchemeAttachments" :key="idx" size="mini" :href="att.filePath"
                  target="_blank" type="primary">
            {{ att.filePath.split('/').pop() }}
          </el-tag>
        </template>
      </el-table-column>
    </el-table>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="approval" size="mini">批 准</el-button>
      <el-popover v-model="popoverVisible"
          placement="top"
          width="600"
          trigger="click" title="选择退回节点" style="padding: 1rem">
        <el-table :data="nodes" size="mini" border style="margin: 1rem 0; width: 100% ">
          <el-table-column type="index" min-width="10%" label="序号"></el-table-column>
          <el-table-column min-width="40%" property="activityName" label="节点"></el-table-column>
          <el-table-column min-width="10%" property="assignee" label="办理人"></el-table-column>
          <el-table-column min-width="40%" label="选择">
            <template slot-scope="scope">
              <el-radio v-model="selectedNodeId" :label="scope.row.activityId"></el-radio>
            </template>
          </el-table-column>
        </el-table>
        <el-button size="mini" type="warning" @click="rollback" style="float: right">确 定</el-button>
        <el-button slot="reference" type="primary" @click="getNodes" size="mini">退 回</el-button>
      </el-popover>

      <el-button type="primary" size="mini" @click="cancle">关 闭</el-button>
    </div>
  </el-dialog>
</template>

<script>
export default {
  name: "SchemeApproval",
  data() {
    return {
      taskId:'',
      selectedNodeId: '',
      visible: false,
      indicatorDetailSchemeApprovalVOS: [],
      title: '',
      personInCharge: '',
      endTime: '',
      nodes: [],
      popoverVisible: false,
    }
  },
  computed: {
    visible: {
      get() {
        return this.$store.state.isVisible;
      },
      set(value) {
        this.$store.commit('setIsVisible', value);
      }
    },
  },
  methods: {
    approval() {
      const indicatorDetailSchemeDTOS = this.indicatorDetailSchemeApprovalVOS
      indicatorDetailSchemeDTOS.forEach(item => {
        item.status = "审批通过"
        item.approvalResult = "agree"
        item.approvalTaskId = this.taskId
      })
      this.$http.post("/kpi/update_schemeStatus/", indicatorDetailSchemeDTOS).then(res => {
        if (res.data.code == 1) {
          this.$message.success("审批完成")
        } else {
          this.$message.error("审批失败，请联系管理员")
        }
      })
      this.visible = false
    },
    rollback() {
      this.popoverVisible = false
      const indicatorDetailSchemeDTOS = this.indicatorDetailSchemeApprovalVOS
      indicatorDetailSchemeDTOS.forEach(item => {
        item.status = "审批未通过"
        item.approvalResult = "reject"
        item.approvalTaskId = this.taskId
      })
      this.$http.post("/kpi/update_schemeStatus/", indicatorDetailSchemeDTOS).then(res => {
        if (res.data.code == 1) {
          this.$message.success("退回成功，进入方案修改节点")
        } else {
          this.$message.error("审批失败，请联系管理员")
        }
      })
      this.visible = false
    },
    getNodes() {
      const taskId = this.$store.state.taskId
      this.$http.get(`/instance/roolbackNodes/${taskId}`).then((response) => {
        if (response.data.code == 1) {
          this.nodes = response.data.data
          console.log(this.nodes)
        }
      })
    },
    cancle() {
      this.visible = false
    }
  },
  mounted() {
    this.visible = true
    this.taskId = this.$store.state.taskId
    this.$http.get(`/kpi/scheme/${this.taskId}`).then((kpiRes) => {
      if (kpiRes.data.code == 1) {
        this.indicatorDetailSchemeApprovalVOS = kpiRes.data.data
        console.log(JSON.stringify(this.indicatorDetailScheme, null, 2))
        this.title = this.indicatorDetailSchemeApprovalVOS[0].title
        this.endTime = this.indicatorDetailSchemeApprovalVOS[0].endTime
        this.personInCharge = this.indicatorDetailSchemeApprovalVOS[0].personInCharge
      }
    })
  }
}
</script>

<style scoped>

</style>